<%- await include('../../layout/header.ejs') %>
<div class="row">
  <div class="col-sm-8">
    <section>
      <%- await include('../../layout/breadcrumb.ejs') %>
      <ul class="article-list media-list">
        <%
          // options
          const options = {
            language: site.language && site.language.current,
            where: {
            },
            orders: [
              [ 'p.sticky', 'desc' ],
              [ 'a.createdAt', 'desc' ],
            ],
            page: { index:0 },
            mode: 'default',
          };
          // select
          const data=await ctx.meta.util.performAction({
            method:'post',
            url: '/a/cms/article/list',
            body: {
              atomClass: site.atomClass,
              options,
            },
          });
          // index
          env('index',{
            [_path]:data.index,
          });
          // list
          for(const item of data.list){
             const sticky = !item.sticky ? '' : '<i class="fas fa-thumbtack"></i> ';
             const audio = !item.audioFirst ? '' : '<i class="fas fa-music"></i> ';
             const attachment = item.attachmentCount===0 ? '' : '<i class="fas fa-paperclip"></i> ';
             const mediaUrl = item.imageCover || item.imageFirst;
             const media = !mediaUrl ? '' : `
      <a class="media-right" target="_blank" href="${url(item.url)}">
        <img class="media-object img-delay" data-src="${util.escapeURL(mediaUrl)}" data-width="125" data-height="100">
      </a>
        `;
        // tags
        let tagsText='';
        const tags=item.atomTags?JSON.parse(item.atomTags):null;
        if(tags && tags.length>0){
          tagsText+='<i class="fas fa-tags"></i> ';
          for(const tagId of tags){
            const tag = await ctx.bean.tag.get({ tagId });
            const tagName = tag.tagName;
            tagsText+=`<a target="_blank" href="${url('static/articles.html')}?tagId=${tagId}&tagName=${encodeURIComponent(tagName)}"><span class="num tag">${util.escapeHtml(tagName)}</span></a>`;
          }
          tagsText+='';
        }
        // stat
        const stat=`
<div class="title stat" data-article-id="${item.atomId}">
<a target="_blank" href="${url('static/articles.html')}?categoryId=${item.atomCategoryId}&categoryName=${encodeURIComponent(item.atomCategoryName)}"><span class="num category">${util.escapeHtml(item.atomCategoryName)}</span></a>
<span class="num date">${util.formatDateTime(item.atomCreatedAt)}</span>
<i class="fas fa-eye"></i><span class="num readCount"></span>
<i class="fas fa-heart"></i><span class="num starCount"></span>
<a target="_blank" href="${url(item.url)}#comments"><i class="fas fa-comment"></i><span class="num commentCount"></span></a>
${tagsText}
</div>
        `;

        const html= `
        <li>
          <div class="article-list-section">
            <div class="article-list-content">
              ${media}
              <h4 class="article-list-title">${sticky}${audio}${attachment}<a target="_blank" href="${url(item.url)}">${util.escapeHtml(item.atomName)}</a></h4>
              <p>${util.escapeHtml(item.description) || item.summary}</p>
            </div>
            ${stat}
          </div>
      </li>
        `;
          echo(html);
          }
        %>
      </ul>
    </section>
  </div>
  <div class="col-sm-4">
    <%- await include('../../layout/sidebar.ejs') %>
  </div>
</div>
<%- await include('../../layout/footer.ejs') %>
